<template>
  <div class="Formgoods">
    <div class="Formitem" v-for="item in formlist" :key="item.id">
      <img :src="item.image" class="pic" />
      <div class="bot">
        <h3 class="title">{{ item.storeName }}</h3>
        <span class="price">￥{{ item.otPrice }}</span>
        <p class="pink">￥{{ item.price }}</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "FxhDemoFormgoods",
  props: ["formlist"],
  data() {
    return {};
  },

  mounted() {},

  methods: {},
};
</script>

<style lang="scss" scoped>
.Formgoods {
  width: 345px;
  margin: auto;
  @include flex;
  flex-wrap: wrap;
  .Formitem {
    margin-top: 10px;
    margin-left: 5px;
    width: 167px;
    height: 240px;
    background: white;
    .pic {
      border-radius: 5px;
      width: 167px;
      height: 165px;
    }
    .bot {
      margin-left: 5px;
      @include cloumn;
      .title {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 14px;
        font-weight: 400;
      }
      .price {
        font-size: 13px;
        color: #aaa;
        line-height: 13px;
        margin-top: 3px;
        text-decoration: line-through;
      }
      .pink {
        color: #ff448f;
        font-size: 17px;
        font-weight: 800;
        margin-top: 3px;
      }
    }
  }
}
</style>
